<template>
	
		<view class="content">
	
			<view class="uni-list">
				<view class="uni-list-cell">
				
					<view class="uni-list-cell-db">
						<picker mode="multiSelector" @columnchange="bindMultiPickerColumnChange" 
						:default-selector='multiIndex'
						:value="multiIndex" 
						@change="changetime"
						:range="multiArray">
							<view class="uni-input lg">{{multiArray[0][multiIndex[0]]}}      {{multiArray[1][multiIndex[1]]}}</view>
						</picker>
					</view>
				</view>
			</view>
		</view>
	</view>

</template>

<script>
import {selectTimeList} from "@/utils/tools.js"
	export default {
		name:"arrival-time",
		props:{
			objitem:{
				type:Object,
				default:()=>{
				
				}
			}
		},
		data() {
			return {
				multiArray: [],
				multiIndex: [0,0],
				timelist:[],
				todaylist:[]
			};
		},
		created() {
			let {selecttime,tomorrowtime,todaylist}=selectTimeList()
			this.multiArray=selecttime
			this.timelist=tomorrowtime
			this.todaylist=todaylist
			
		},
		methods:{
			bindMultiPickerColumnChange: function(e) {
				this.multiIndex[e.detail.column] = e.detail.value
				
				switch(e.detail.column){
				case 0:
				switch(this.multiIndex[0]){
					case 0:
					this.multiArray[1]=this.todaylist
                     this.multiIndex.splice(1, 1, 0)
					break
					default:
					this.multiArray[1]=this.timelist
					this.multiIndex.splice(1, 1, 0)
				}
				break
			}
			this.$forceUpdate()
				},
				changetime(){
					let time=`${this.multiArray[0][this.multiIndex[0]]}  ${this.multiArray[1][this.multiIndex[1]]}`
					this.$emit("changtime",time)
				}
		}
	}
</script>

<style lang="scss" scoped>
.content{
	
	.title{
		padding-left: 20rpx;
		
	font-size: 30rpx;
	font-weight: 600;
	}
}
.uni-list{
	margin-right: 30rpx;
	.uni-input{
		
	}
}
</style>
